// FancyZoom.js - v1.1 - http://www.fancyzoom.com
//
// Copyright (c) 2008 Cabel Sasser / Panic Inc
// All rights reserved.
//
//     Requires: FancyZoomHTML.js
// Instructions: Include JS files in page, call setupZoom() in onLoad. That's it!
//               Any <a href> links to images will be updated to zoom inline.
//               Add rel="nozoom" to your <a href> to disable zooming for an image.
//
// Redistribution and use of this effect in source form, with or without modification,
// are permitted provided that the following conditions are met:
//
// * USE OF SOURCE ON COMMERCIAL (FOR-PROFIT) WEBSITE REQUIRES ONE-TIME LICENSE FEE PER DOMAIN.
//   Reasonably priced! Visit www.fancyzoom.com for licensing instructions. Thanks!
//
// * Non-commercial (personal) website use is permitted without license/payment!
//
// * Redistribution of source code must retain the above copyright notice,
//   this list of conditions and the following disclaimer.
//
// * Redistribution of source code and derived works cannot be sold without specific
//   written prior permission.
//
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
// CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
// EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
// PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
// PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
// LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
// NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
// SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

var includeCaption = true; // Turn on the "caption" feature, and write out the caption HTML
var zoomTime = 5;    // Milliseconds between frames of zoom animation
var zoomSteps = 15;   // Number of zoom animation frames
var includeFade = 1;    // Set to 1 to fade the image in / out as it zooms
var minBorder = 90;   // Amount of padding between large, scaled down images, and the window edges
var shadowSettings = '0px 5px 25px rgba(0, 0, 0, '; // Blur, radius, color of shadow for compatible browsers

// Location of the zoom and shadow images
var zoomImagesURI;

// Init. Do not add anything below this line, unless it's something awesome.

var myWidth = 0, myHeight = 0, myScroll = 0;
myScrollWidth = 0;
myScrollHeight = 0;
var zoomOpen = false, preloadFrame = 1, preloadActive = false, preloadTime = 0, imgPreload = new Image();
var preloadAnimTimer = 0;

var zoomActive = new Array();
var zoomTimer = new Array();
var zoomOrigW = new Array();
var zoomOrigH = new Array();
var zoomOrigX = new Array();
var zoomOrigY = new Array();

var zoomID = "ZoomBox";
var theID = "ZoomImage";
var zoomCaption = "ZoomCaption";
var zoomCaptionDiv = "ZoomCapDiv";

if (navigator.userAgent.indexOf("MSIE") != -1) {
    var browserIsIE = true;
}

// Zoom: Setup The Page! Called in your <body>'s onLoad handler. 

function setupZoom(baseURI) {
    zoomImagesURI = baseURI + 'script/fancyzoom/images/';

    prepZooms();
    insertZoomHTML();
    zoomdiv = document.getElementById(zoomID);
    zoomimg = document.getElementById(theID);
}

// Zoom: Inject Javascript functions into hrefs with a "zoom" rel.
// This is done at page load time via an onLoad() handler.

function prepZooms() {
    if (!document.getElementsByTagName) {
        return;
    }
    var links = document.getElementsByTagName("a");
    for (i = 0; i < links.length; i++) {
        if (links[i].getAttribute("href")) {
            if (links[i].getAttribute("rel") == "zoom") {
                links[i].onclick = function(event) {
                    return zoomClick(this, event);
                };
                links[i].onmouseover = function() {
                    zoomPreload(this);
                };
            }
        }
    }
}

// Zoom: Load an image into an image object. When done loading, function sets preloadActive to false,
// so other bits know that they can proceed with the zoom.
// Preloaded image is stored in imgPreload and swapped out in the zoom function.

function zoomPreload(from) {

    var theimage = from.getAttribute("href");

    // Only preload if we have to, i.e. the image isn't this image already

    if (imgPreload.src.indexOf(from.getAttribute("href").substr(from.getAttribute("href").lastIndexOf("/"))) == -1) {
        preloadActive = true;
        imgPreload = new Image();

        // Set a function to fire when the preload is complete, setting flags along the way.

        imgPreload.onload = function() {
            preloadActive = false;
        }

        // Load it!
        imgPreload.src = theimage;
    }
}

// Zoom: Start the preloading animation cycle.

function preloadAnimStart() {
    preloadTime = new Date();
    document.getElementById("ZoomSpin").style.left = (myWidth / 2) + 'px';
    document.getElementById("ZoomSpin").style.top = ((myHeight / 2) + myScroll) + 'px';
    document.getElementById("ZoomSpin").style.visibility = "visible";
    preloadFrame = 1;
    document.getElementById("SpinImage").src = zoomImagesURI + 'zoom-spin-' + preloadFrame + '.png';
    preloadAnimTimer = setInterval("preloadAnim()", 100);
}

// Zoom: Display and ANIMATE the jibber-jabber widget. Once preloadActive is false, bail and zoom it up!

function preloadAnim(from) {
    if (preloadActive != false) {
        document.getElementById("SpinImage").src = zoomImagesURI + 'zoom-spin-' + preloadFrame + '.png';
        preloadFrame++;
        if (preloadFrame > 12)
            preloadFrame = 1;
    } else {
        document.getElementById("ZoomSpin").style.visibility = "hidden";
        clearInterval(preloadAnimTimer);
        preloadAnimTimer = 0;
        zoomIn(preloadFrom);
    }
}

// ZOOM CLICK: We got a click! Should we do the zoom? Or wait for the preload to complete?
// todo?: Double check that imgPreload src = clicked src

function zoomClick(from, evt) {

    var shift = getShift(evt);

    // Check for Command / Alt key. If pressed, pass them through -- don't zoom!
    if (!evt && window.event && (window.event.metaKey || window.event.altKey)) {
        return true;
    } else if (evt && (evt.metaKey || evt.altKey)) {
        return true;
    }

    // Get browser dimensions
    getSize();

    // If preloading still, wait, and display the spinner.
    if (preloadActive == true) {
        // But only display the spinner if it's not already being displayed!
        if (preloadAnimTimer == 0) {
            preloadFrom = from;
            preloadAnimStart();
        }
    } else {
        // Otherwise, we're loaded: do the zoom!
        zoomIn(from, shift);
    }

    return false;

}

// Zoom: Move an element in to endH endW, using zoomHost as a starting point.
// "from" is an object reference to the href that spawned the zoom.

function zoomIn(from, shift) {

    zoomimg.src = from.getAttribute("href");

    // Determine the zoom settings from where we came from, the element in the <a>.
    // If there's no element in the <a>, or we can't get the width, make stuff up

    if (from.childNodes[0].width) {
        startW = from.childNodes[0].width;
        startH = from.childNodes[0].height;
        startPos = findElementPos(from.childNodes[0]);
    } else {
        startW = 50;
        startH = 12;
        startPos = findElementPos(from);
    }

    hostX = startPos[0];
    hostY = startPos[1];

    // Make up for a scrolled containing div.
    // TODO: This HAS to move into findElementPos.

    if (document.getElementById('scroller')) {
        hostX = hostX - document.getElementById('scroller').scrollLeft;
    }

    // Determine the target zoom settings from the preloaded image object

    endW = imgPreload.width;
    endH = imgPreload.height;

    // Start! But only if we're not zooming already!

    if (zoomActive[theID] != true) {

        // Clear everything out just in case something is already open

        if (document.getElementById("ShadowBox")) {
            document.getElementById("ShadowBox").style.visibility = "hidden";
        } else if (!browserIsIE) {

            // Wipe timer if shadow is fading in still
            if (fadeActive["ZoomImage"]) {
                clearInterval(fadeTimer["ZoomImage"]);
                fadeActive["ZoomImage"] = false;
                fadeTimer["ZoomImage"] = false;
            }

            document.getElementById("ZoomImage").style.webkitBoxShadow = shadowSettings + '0.0)';
        }

        document.getElementById("ZoomClose").style.visibility = "hidden";

        // Setup the CAPTION, if existing. Hide it first, set the text.

        if (includeCaption) {
            document.getElementById(zoomCaptionDiv).style.visibility = "hidden";
            if (from.getAttribute('title') && includeCaption) {
                // Yes, there's a caption, set it up
                document.getElementById(zoomCaption).innerHTML = from.getAttribute('title');
            } else {
                document.getElementById(zoomCaption).innerHTML = "";
            }
        }

        // Store original position in an array for future zoomOut.

        zoomOrigW[theID] = startW;
        zoomOrigH[theID] = startH;
        zoomOrigX[theID] = hostX;
        zoomOrigY[theID] = hostY;

        // Now set the starting dimensions

        zoomimg.style.width = startW + 'px';
        zoomimg.style.height = startH + 'px';
        zoomdiv.style.left = hostX + 'px';
        zoomdiv.style.top = hostY + 'px';

        // Show the zooming image container, make it invisible

        if (includeFade == 1) {
            setOpacity(0, zoomID);
        }
        zoomdiv.style.visibility = "visible";

        // If it's too big to fit in the window, shrink the width and height to fit (with ratio).

        sizeRatio = endW / endH;
        if (endW > myWidth - minBorder) {
            endW = myWidth - minBorder;
            endH = endW / sizeRatio;
        }
        if (endH > myHeight - minBorder) {
            endH = myHeight - minBorder;
            endW = endH * sizeRatio;
        }

        zoomChangeX = ((myWidth / 2) - (endW / 2) - hostX);
        zoomChangeY = (((myHeight / 2) - (endH / 2) - hostY) + myScroll);
        zoomChangeW = (endW - startW);
        zoomChangeH = (endH - startH);

        // Shift key?

        if (shift) {
            tempSteps = zoomSteps * 7;
        } else {
            tempSteps = zoomSteps;
        }

        // Setup Zoom

        zoomCurrent = 0;

        // Setup Fade with Zoom, If Requested

        if (includeFade == 1) {
            fadeCurrent = 0;
            fadeAmount = (0 - 100) / tempSteps;
        } else {
            fadeAmount = 0;
        }

        // Do It!

        zoomTimer[theID] = setInterval("zoomElement('" + zoomID + "', '" + theID + "', " + zoomCurrent + ", " + startW + ", " + zoomChangeW + ", " + startH + ", " + zoomChangeH + ", " + hostX + ", " + zoomChangeX + ", " + hostY + ", " + zoomChangeY + ", " + tempSteps + ", " + includeFade + ", " + fadeAmount + ", 'zoomDoneIn(zoomID)')", zoomTime);
        zoomActive[theID] = true;
    }
}

// Zoom it back out.

function zoomOut(from, evt) {

    // Get shift key status.
    // IE events don't seem to get passed through the function, so grab it from the window.

    if (getShift(evt)) {
        tempSteps = zoomSteps * 7;
    } else {
        tempSteps = zoomSteps;
    }

    // Check to see if something is happening/open

    if (zoomActive[theID] != true) {

        // First, get rid of the shadow if necessary.

        if (document.getElementById("ShadowBox")) {
            document.getElementById("ShadowBox").style.visibility = "hidden";
        } else if (!browserIsIE) {

            // Wipe timer if shadow is fading in still
            if (fadeActive["ZoomImage"]) {
                clearInterval(fadeTimer["ZoomImage"]);
                fadeActive["ZoomImage"] = false;
                fadeTimer["ZoomImage"] = false;
            }

            document.getElementById("ZoomImage").style.webkitBoxShadow = shadowSettings + '0.0)';
        }

        // ..and the close box...

        document.getElementById("ZoomClose").style.visibility = "hidden";

        // ...and the caption if necessary!

        if (includeCaption && document.getElementById(zoomCaption).innerHTML != "") {
            // fadeElementSetup(zoomCaptionDiv, 100, 0, 5, 1);
            document.getElementById(zoomCaptionDiv).style.visibility = "hidden";
        }

        // Now, figure out where we came from, to get back there

        startX = parseInt(zoomdiv.style.left);
        startY = parseInt(zoomdiv.style.top);
        startW = zoomimg.width;
        startH = zoomimg.height;
        zoomChangeX = zoomOrigX[theID] - startX;
        zoomChangeY = zoomOrigY[theID] - startY;
        zoomChangeW = zoomOrigW[theID] - startW;
        zoomChangeH = zoomOrigH[theID] - startH;

        // Setup Zoom

        zoomCurrent = 0;

        // Setup Fade with Zoom, If Requested

        if (includeFade == 1) {
            fadeCurrent = 0;
            fadeAmount = (100 - 0) / tempSteps;
        } else {
            fadeAmount = 0;
        }

        // Do It!

        zoomTimer[theID] = setInterval("zoomElement('" + zoomID + "', '" + theID + "', " + zoomCurrent + ", " + startW + ", " + zoomChangeW + ", " + startH + ", " + zoomChangeH + ", " + startX + ", " + zoomChangeX + ", " + startY + ", " + zoomChangeY + ", " + tempSteps + ", " + includeFade + ", " + fadeAmount + ", 'zoomDone(zoomID, theID)')", zoomTime);
        zoomActive[theID] = true;
    }
}

// Finished Zooming In

function zoomDoneIn(zoomdiv, theID) {

    // Note that it's open

    zoomOpen = true;
    zoomdiv = document.getElementById(zoomdiv);

    // Position the table shadow behind the zoomed in image, and display it

    if (document.getElementById("ShadowBox")) {

        setOpacity(0, "ShadowBox");
        shadowdiv = document.getElementById("ShadowBox");

        shadowLeft = parseInt(zoomdiv.style.left) - 13;
        shadowTop = parseInt(zoomdiv.style.top) - 8;
        shadowWidth = zoomdiv.offsetWidth + 26;
        shadowHeight = zoomdiv.offsetHeight + 26;

        shadowdiv.style.width = shadowWidth + 'px';
        shadowdiv.style.height = shadowHeight + 'px';
        shadowdiv.style.left = shadowLeft + 'px';
        shadowdiv.style.top = shadowTop + 'px';

        document.getElementById("ShadowBox").style.visibility = "visible";
        fadeElementSetup("ShadowBox", 0, 100, 5);

    } else if (!browserIsIE) {
        // Or, do a fade of the modern shadow
        fadeElementSetup("ZoomImage", 0, .8, 5, 0, "shadow");
    }

    // Position and display the CAPTION, if existing

    if (includeCaption && document.getElementById(zoomCaption).innerHTML != "") {
        // setOpacity(0, zoomCaptionDiv);
        zoomcapd = document.getElementById(zoomCaptionDiv);
        zoomcapd.style.top = parseInt(zoomdiv.style.top) + (zoomdiv.offsetHeight + 15) + 'px';
        zoomcapd.style.left = (myWidth / 2) - (zoomcapd.offsetWidth / 2) + 'px';
        zoomcapd.style.visibility = "visible";
        // fadeElementSetup(zoomCaptionDiv, 0, 100, 5);
    }

    // Display Close Box (fade it if it's not IE)

    if (!browserIsIE)
        setOpacity(0, "ZoomClose");
    document.getElementById("ZoomClose").style.visibility = "visible";
    if (!browserIsIE)
        fadeElementSetup("ZoomClose", 0, 100, 5);

    // Get keypresses
    document.onkeypress = getKey;

}

// Finished Zooming Out

function zoomDone(zoomdiv, theID) {

    // No longer open

    zoomOpen = false;

    // Clear stuff out, clean up

    zoomOrigH[theID] = "";
    zoomOrigW[theID] = "";
    document.getElementById(zoomdiv).style.visibility = "hidden";
    zoomActive[theID] == false;

    // Stop getting keypresses

    document.onkeypress = null;

}

// Actually zoom the element

function zoomElement(zoomdiv, theID, zoomCurrent, zoomStartW, zoomChangeW, zoomStartH, zoomChangeH, zoomStartX, zoomChangeX, zoomStartY, zoomChangeY, zoomSteps, includeFade, fadeAmount, execWhenDone) {

    // console.log("Zooming Step #"+zoomCurrent+ " of "+zoomSteps+" (zoom " + zoomStartW + "/" + zoomChangeW + ") (zoom " + zoomStartH + "/" + zoomChangeH + ")  (zoom " + zoomStartX + "/" + zoomChangeX + ")  (zoom " + zoomStartY + "/" + zoomChangeY + ") Fade: "+fadeAmount);

    // Test if we're done, or if we continue

    if (zoomCurrent == (zoomSteps + 1)) {
        zoomActive[theID] = false;
        clearInterval(zoomTimer[theID]);

        if (execWhenDone != "") {
            eval(execWhenDone);
        }
    } else {

        // Do the Fade!

        if (includeFade == 1) {
            if (fadeAmount < 0) {
                setOpacity(Math.abs(zoomCurrent * fadeAmount), zoomdiv);
            } else {
                setOpacity(100 - (zoomCurrent * fadeAmount), zoomdiv);
            }
        }

        // Calculate this step's difference, and move it!

        moveW = cubicInOut(zoomCurrent, zoomStartW, zoomChangeW, zoomSteps);
        moveH = cubicInOut(zoomCurrent, zoomStartH, zoomChangeH, zoomSteps);
        moveX = cubicInOut(zoomCurrent, zoomStartX, zoomChangeX, zoomSteps);
        moveY = cubicInOut(zoomCurrent, zoomStartY, zoomChangeY, zoomSteps);

        document.getElementById(zoomdiv).style.left = moveX + 'px';
        document.getElementById(zoomdiv).style.top = moveY + 'px';
        zoomimg.style.width = moveW + 'px';
        zoomimg.style.height = moveH + 'px';

        zoomCurrent++;

        clearInterval(zoomTimer[theID]);
        zoomTimer[theID] = setInterval("zoomElement('" + zoomdiv + "', '" + theID + "', " + zoomCurrent + ", " + zoomStartW + ", " + zoomChangeW + ", " + zoomStartH + ", " + zoomChangeH + ", " + zoomStartX + ", " + zoomChangeX + ", " + zoomStartY + ", " + zoomChangeY + ", " + zoomSteps + ", " + includeFade + ", " + fadeAmount + ", '" + execWhenDone + "')", zoomTime);
    }
}

// Zoom Utility: Get Key Press when image is open, and act accordingly

function getKey(evt) {
    if (!evt) {
        theKey = event.keyCode;
    } else {
        theKey = evt.keyCode;
    }

    if (theKey == 27) { // ESC
        zoomOut(this, evt);
    }
}

////////////////////////////
//
// FADE Functions
//

function fadeOut(elem) {
    if (elem.id) {
        fadeElementSetup(elem.id, 100, 0, 10);
    }
}

function fadeIn(elem) {
    if (elem.id) {
        fadeElementSetup(elem.id, 0, 100, 10);
    }
}

// Fade: Initialize the fade function

var fadeActive = new Array();
var fadeQueue = new Array();
var fadeTimer = new Array();
var fadeClose = new Array();
var fadeMode = new Array();

function fadeElementSetup(theID, fdStart, fdEnd, fdSteps, fdClose, fdMode) {

    // alert("Fading: "+theID+" Steps: "+fdSteps+" Mode: "+fdMode);

    if (fadeActive[theID] == true) {
        // Already animating, queue up this command
        fadeQueue[theID] = new Array(theID, fdStart, fdEnd, fdSteps);
    } else {
        fadeSteps = fdSteps;
        fadeCurrent = 0;
        fadeAmount = (fdStart - fdEnd) / fadeSteps;
        fadeTimer[theID] = setInterval("fadeElement('" + theID + "', '" + fadeCurrent + "', '" + fadeAmount + "', '" + fadeSteps + "')", 15);
        fadeActive[theID] = true;
        fadeMode[theID] = fdMode;

        if (fdClose == 1) {
            fadeClose[theID] = true;
        } else {
            fadeClose[theID] = false;
        }
    }
}

// Fade: Do the fade. This function will call itself, modifying the parameters, so
// many instances can run concurrently. Can fade using opacity, or fade using a box-shadow.

function fadeElement(theID, fadeCurrent, fadeAmount, fadeSteps) {

    if (fadeCurrent == fadeSteps) {

        // We're done, so clear.

        clearInterval(fadeTimer[theID]);
        fadeActive[theID] = false;
        fadeTimer[theID] = false;

        // Should we close it once the fade is complete?

        if (fadeClose[theID] == true) {
            document.getElementById(theID).style.visibility = "hidden";
        }

        // Hang on.. did a command queue while we were working? If so, make it happen now

        if (fadeQueue[theID] && fadeQueue[theID] != false) {
            fadeElementSetup(fadeQueue[theID][0], fadeQueue[theID][1], fadeQueue[theID][2], fadeQueue[theID][3]);
            fadeQueue[theID] = false;
        }
    } else {

        fadeCurrent++;

        // Now actually do the fade adjustment.

        if (fadeMode[theID] == "shadow") {

            // Do a special fade on the webkit-box-shadow of the object

            if (fadeAmount < 0) {
                document.getElementById(theID).style.webkitBoxShadow = shadowSettings + (Math.abs(fadeCurrent * fadeAmount)) + ')';
            } else {
                document.getElementById(theID).style.webkitBoxShadow = shadowSettings + (100 - (fadeCurrent * fadeAmount)) + ')';
            }

        } else {

            // Set the opacity depending on if we're adding or subtracting (pos or neg)

            if (fadeAmount < 0) {
                setOpacity(Math.abs(fadeCurrent * fadeAmount), theID);
            } else {
                setOpacity(100 - (fadeCurrent * fadeAmount), theID);
            }
        }

        // Keep going, and send myself the updated variables
        clearInterval(fadeTimer[theID]);
        fadeTimer[theID] = setInterval("fadeElement('" + theID + "', '" + fadeCurrent + "', '" + fadeAmount + "', '" + fadeSteps + "')", 15);
    }
}

////////////////////////////
//
// UTILITY functions
//

// Utility: Set the opacity, compatible with a number of browsers. Value from 0 to 100.

function setOpacity(opacity, theID) {

    var object = document.getElementById(theID).style;

    // If it's 100, set it to 99 for Firefox.

    if (navigator.userAgent.indexOf("Firefox") != -1) {
        if (opacity == 100) {
            opacity = 99.9999;
        } // This is majorly awkward
    }

    // Multi-browser opacity setting

    object.filter = "alpha(opacity=" + opacity + ")"; // IE/Win
    object.opacity = (opacity / 100);                 // Safari 1.2, Firefox+Mozilla

}

// Utility: Math functions for animation calucations - From http://www.robertpenner.com/easing/
//
// t = time, b = begin, c = change, d = duration
// time = current frame, begin is fixed, change is basically finish - begin, duration is fixed (frames),

function linear(t, b, c, d)
{
    return c * t / d + b;
}

function sineInOut(t, b, c, d)
{
    return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
}

function cubicIn(t, b, c, d) {
    return c * (t /= d) * t * t + b;
}

function cubicOut(t, b, c, d) {
    return c * ((t = t / d - 1) * t * t + 1) + b;
}

function cubicInOut(t, b, c, d)
{
    if ((t /= d / 2) < 1)
        return c / 2 * t * t * t + b;
    return c / 2 * ((t -= 2) * t * t + 2) + b;
}

function bounceOut(t, b, c, d)
{
    if ((t /= d) < (1 / 2.75)) {
        return c * (7.5625 * t * t) + b;
    } else if (t < (2 / 2.75)) {
        return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
    } else if (t < (2.5 / 2.75)) {
        return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
    } else {
        return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
    }
}


// Utility: Get the size of the window, and set myWidth and myHeight
// Credit to quirksmode.org

function getSize() {

    // Window Size

    if (self.innerHeight) { // Everyone but IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
        myScroll = window.pageYOffset;
    } else if (document.documentElement && document.documentElement.clientHeight) { // IE6 Strict
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
        myScroll = document.documentElement.scrollTop;
    } else if (document.body) { // Other IE, such as IE7
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
        myScroll = document.body.scrollTop;
    }

    // Page size w/offscreen areas

    if (window.innerHeight && window.scrollMaxY) {
        myScrollWidth = document.body.scrollWidth;
        myScrollHeight = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight) { // All but Explorer Mac
        myScrollWidth = document.body.scrollWidth;
        myScrollHeight = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
        myScrollWidth = document.body.offsetWidth;
        myScrollHeight = document.body.offsetHeight;
    }
}

// Utility: Get Shift Key Status
// IE events don't seem to get passed through the function, so grab it from the window.

function getShift(evt) {
    var shift = false;
    if (!evt && window.event) {
        shift = window.event.shiftKey;
    } else if (evt) {
        shift = evt.shiftKey;
        if (shift)
            evt.stopPropagation(); // Prevents Firefox from doing shifty things
    }
    return shift;
}

// Utility: Find the Y position of an element on a page. Return Y and X as an array

function findElementPos(elemFind)
{
    var elemX = 0;
    var elemY = 0;
    do {
        elemX += elemFind.offsetLeft;
        elemY += elemFind.offsetTop;
    } while (elemFind = elemFind.offsetParent)

    return Array(elemX, elemY);
}